<style>
    .tab-content > .chart {
        padding: 10px;
    }
</style>
<div class="row">

    <div class="col-lg-3 col-xs-6">

        <div class="small-box bg-yellow">
            <div class="inner">
                <h3>{$month_goods_total}</h3>
                <p>本月团次</p>
            </div>
            <div class="icon">
                <i class="fa fa-users"></i>
            </div>
        </div>
    </div>
    <div class="col-lg-3 col-xs-6">
        <div class="small-box bg-aqua">
            <div class="inner">
                <h3>{$month_customer_total}</h3>
                <p>发团总人数</p>
            </div>
            <div class="icon">
                <i class="fa fa-shopping-cart"></i>
            </div>
        </div>
    </div>
    <div class="col-lg-3 col-xs-6">
        <div class="small-box bg-green">
            <div class="inner">
                <h3>{$month_vip_add}</h3>
                <p>本月会员新增</p>
            </div>
            <div class="icon">
                <i class="fa fa-area-chart"></i>
            </div>
        </div>
    </div>




    <div class="col-lg-3 col-xs-6">

        <div class="small-box bg-red">
            <div class="inner">
                <h3>{$vip_total}</h3>

                <p>会员总数</p>
            </div>
            <div class="icon">
                <i class="fa fa-user"></i>
            </div>
        </div>
    </div>

</div>

<div class="row" style="margin-bottom:5px;">
    <!-- Left col -->
    <section class="col-lg-7 connectedSortable">



        <div class="nav-tabs-custom charts-custom">

            <ul class="nav nav-tabs pull-right">
                <li class="pull-left header"><i class="fa fa-inbox"></i>线路统计</li>
            </ul>
            <div class="tab-content no-padding">
                <div class="chart  active" id="line-chart-goods" style="position: relative; height: 300px;"></div>
            </div>
        </div>


        <div class="nav-tabs-custom charts-custom">

            <ul class="nav nav-tabs pull-right">
                <li class="pull-left header"><i class="fa fa-inbox"></i>报名统计</li>
            </ul>
            <div class="tab-content no-padding">
                <div class="chart  active" id="line-chart" style="position: relative; height: 300px;"></div>
            </div>
        </div>



        <div class="nav-tabs-custom charts-custom">
            <!-- Tabs within a box -->
            <ul class="nav nav-tabs pull-right">
                <li class="pull-left header"><i class="fa fa-inbox"></i>会员新增统计</li>
            </ul>
            <div class="tab-content no-padding">
                <div class="chart  active" id="area-chart" style="position: relative; height: 300px;"></div>

            </div>
        </div>

    </section>
    <!-- /.Left col -->
    <section class="col-lg-5 connectedSortable">

        <div class="box box-solid bg-light-blue-gradient">
            <div class="box-header">
                <div class="pull-right box-tools">
                </div>
                <i class="fa fa-map-marker"></i>
                <h3 class="box-title">
                    线路分布
                </h3>
            </div>
            <div class="box-body">
                <div id="simplebar-chart-goods" style="height: 250px; width: 100%;"></div>
            </div>

            <div class="box-footer no-border">
                <div class="row">
                    <div class="col-xs-12 text-center">
                        <div class="knob-label">统计最近一月报名的记录</div>
                    </div>

                </div>

            </div>
        </div>


        <!-- Map box -->
        <div class="box box-solid bg-light-blue-gradient">
            <div class="box-header">
                <div class="pull-right box-tools">
                </div>
                <i class="fa fa-map-marker"></i>
                <h3 class="box-title">
                    报名分布
                </h3>
            </div>
            <div class="box-body">
                <div id="simplebar-chart" style="height: 250px; width: 100%;"></div>
            </div>

            <div class="box-footer no-border">
                <div class="row">
                    <div class="col-xs-12 text-center">
                        <div class="knob-label">统计最近一月报名的记录</div>
                    </div>

                </div>

            </div>
        </div>
        <!-- /.box -->

        <!-- solid sales graph -->
        <div class="box box-solid bg-teal-gradient">
            <div class="box-header">
                <i class="fa fa-th"></i>

                <h3 class="box-title">会员分布</h3>

                <div class="box-tools pull-right">
                </div>
            </div>
            <div class="box-body border-radius-none">
                <div class="chart" id="smoothline-chart" style="height: 250px;"></div>
            </div>
            <!-- /.box-body-->
            <div class="box-footer no-border">
                <div class="row">
                    <div class="col-xs-12 text-center">
                        <div class="knob-label">统计最近一月会员的统计</div>
                    </div>
                    <!-- ./col -->
                </div>
                <!-- /.row -->
            </div>
        </div>
        <!-- /.box -->

    </section>
    <!-- right col -->
</div>
<script>
    var customer_add = {
        column: {:json_encode(array_keys($customer_add))},
    data: {:json_encode(array_values($customer_add))},
    };

    var user_add = {
        column: {:json_encode(array_keys($user_add))},
    data: {:json_encode(array_values($user_add))},
    };
    var goods_add = {
        column: {:json_encode(array_keys($goods_add))},
    data: {:json_encode(array_values($goods_add))},
    };

    var customer_add_compare = {
        column: {:json_encode(array_keys($customer_add_compare))},
    data: {:json_encode(array_values($customer_add_compare))},
    };
    var user_add_compare = {
        column: {:json_encode(array_keys($user_add_compare))},
    data: {:json_encode(array_values($user_add_compare))},
    };

    var goods_add_compare = {
        column: {:json_encode(array_keys($goods_add_compare))},
    data: {:json_encode(array_values($goods_add_compare))},
    };


</script>
